<route lang="json5" type="page">
{
  layout: 'main',
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '咨询反馈',
  },
}
</route>

<template>
  <view class="container">
    <wd-form ref="reportForm" :model="formData" :rules="rules">
      <wd-cell-group title="添加咨询反馈" border>
        <wd-textarea
          label="咨询内容"
          prop="content"
          v-model="formData.content"
          placeholder="请输入咨询内容"
        />
      </wd-cell-group>
      <view class="mt-4 ml-2 mr-8">
        <wd-button @click="handleSubmit" block>提交</wd-button>
      </view>
    </wd-form>
  </view>
  <wd-toast />
</template>

<script lang="ts" setup>
import { reactive, ref } from 'vue'
import cache from '@/utils/cache'
import { addFeedback } from '@/api/work'
import { useUserStore } from '@/store/user'
import { useToast } from 'wot-design-uni'

const toast = useToast()

const userStore = useUserStore()
const reportForm = ref()
const formData = reactive<{
  consultId: number
  workId: string
  userId: number
  content: string
}>({
  consultId: cache.get('counselorInfo').id,
  workId: cache.get('workItem').id,
  userId: userStore.userInfo.openid,
  content: '',
})

const rules = {
  content: [{ required: true, message: '请输入咨询内容', trigger: 'blur' }],
}

const handleSubmit = () => {
  reportForm.value.validate().then(({ valid, errors }) => {
    if (!valid) {
      console.log('表单验证失败!', errors)
      return
    }

    addFeedback(formData)
      .then(() => {
        toast.success('咨询反馈提交成功!')
        uni.navigateBack()
      })
      .catch(() => {
        toast.error('咨询反馈提交失败')
      })
  })
}
</script>

<style lang="scss" scoped></style>
